<!DOCTYPE HTML>
<html>
<head>
<title>Test for WebKit bug 31559: Crash with mismatched lists and shorthands.</title>
<script src="../../resources/js-test.js"></script>
</head>
<body>
  <p id="description">Test for WebKit bug <a href="https://bugs.webkit.org/show_bug.cgi?id=31559">31559</a>: Crash with mismatched lists and shorthands.</p>
  <div id="console"></div>

  <div id="test"></div>

<script>
  var para = document.getElementById('test');
  
  // Test longer shorthand
  para.style.webkitTransition = 'width 1s, left 1s, top 1s';
  para.style.webkitTransitionProperty = 'width, left';

  shouldBeEqualToString("para.style.webkitTransition", "width 1s ease 0s, left 1s ease 0s, 1s ease 0s");

  // Test shorter shorthand
  para.style.webkitTransition = 'width 1s, left 1s';
  para.style.webkitTransitionProperty = 'width, left, top';

  // the next line will crash
  shouldBeEqualToString("para.style.webkitTransition", "width 1s ease 0s, left 1s ease 0s, top");
</script>
</body>
</html>
